/***********样式重置*************/
*{
  padding: 0;
  margin:0;
  color: #333;
}
ul li{
  list-style: none;
}
a{
  text-decoration: none;
}
/***********通用样式*************/
body{
  font:12px/1.5 arial,tahoma,"宋体";
  background: #f2f2f2;
  padding-bottom: 800px;
}
/***********通用样式结束*************/

/***********顶部广告区*************/
.top-ad{
  display: block;
  width:100%;
  height:100px;
  background: #F80E29;
    .box{
      width:1190px;
      height:100px;
      margin:0 auto;
      background: blue;
      position: relative;
        img{
          width:100%;
          height:100%;
        }
        i{
          display: block;
          width:15px;
          height:15px;
          background: url("../images/ico-index.png") no-repeat -241px -145px;
          position: absolute;
          right:21px;
          top:3px;
          cursor: pointer;
        }
        i:hover{
          background-position: -256px -145px;
        }
    }//.box
}//.top-ad

/***********顶部广告区结束*************/

/***********顶部登录区*************/
.header-loginBar{
  width:100%;
  height:35px;
  background:#F5F5F5;
  border-bottom:1px solid #EEEEEE;
    .box{
      width:1190px;
      height:35px;
      margin:0 auto;
      ul li{ //left-menu和right-menu共用样式
        position: relative;
        &.down{
            .down-title{//标题
              display: block;
              width:100%;
              height:35px;
              color: #666;
              position: relative;
              z-index: 5;
              &.cur{//鼠标移入后效果
                background: #fff;
                border:1px solid #ddd;
                border-bottom: none;
                width:80px;
                //width:100%;
                line-height: 33px;
              }
            }//down-title
            .submenu{//下拉二级菜单
              border:1px solid #ddd;
              background: #fff;
              position: absolute;
              left:0px;
              top:35px;
              z-index: 3;
              display: none;
              line-height: normal;
              text-align: left;
            }//.submenu
        }//li.down
        .iconfont.down{ font-size:10px; color: #bbb;  margin-left: 5px; position: relative;bottom: 0}//下拉小箭头
        a{font-family: "Microsoft YaHei";//链接
          color: #666;
          &:hover {
            color: #f60;
            text-decoration: underline;}
        }
      }//ul li

      .left-menu{//左侧按钮
          float: left;
          li{
            float: left;
            font-family: "Microsoft YaHei";
            color: #666;
            width:82px;
            height:35px;
            line-height: 35px;
            text-align: center;
            margin-right: -1px;
            //cursor: pointer;
            &.daohang{//网站导航
              .down-title{
                cursor: default;
              }
              .submenu{
                width:988px;
                height:240px;
                //display: block;
                .ico-x{//关闭按钮
                  line-height: 20px;
                  font-size:22px;
                  color: #666;
                  cursor: pointer;
                  position: absolute;
                  right:8px;
                  top:10px;
                  &:hover{
                    color: #f60;
                  }
                }
                .content{//详细内容链接
                  //width:196px;//问题：为什么将width属性取消掉后不会被挤下去
                  height:240px;
                  float: left;
                  &:last-child ul{
                    border-right:none;
                  }
                  ul{
                    width:176px;
                    margin-left:20px;
                    margin-top:20px;
                    border-right:1px solid #eee;
                    overflow: hidden;
                    float: left;
                    .title{//标题
                      width: 160px;
                      color: #333;
                      font-size: 14px;
                      margin-bottom: 5px;
                    }
                    li{//子按钮
                      width:78px;
                      height:20px;
                      margin-top: 5px;
                      padding: 0;
                      line-height: 20px;
                      text-align: left;
                      a{
                        display: block;
                        width:78px;
                        height:20px;
                        &:hover{
                          text-decoration: none;
                        }
                        .ico-hot{//热
                          display: inline-block;
                          width:14px;
                          height:14px;
                          background: url(../images/ico-index-2.png) 0 -205px;
                          position: relative;
                          left:2px;
                          bottom:3px;
                        }
                      }//a
                    }//li
                  }//ul
                }//.content
              }//.submenu
            }//li.daohang
            &.shangjia{//商家入驻
              .submenu{
                width:162px;
                height:94px;
                .content{
                  ul{
                    li{
                      width:78px;
                      height:20px;
                      margin-top: 8px;
                      padding: 0;
                      line-height: 20px;
                      text-align: center;
                      a:hover{
                        text-decoration: none;
                      }
                    }
                  }//ul
                }//.content
              }//.submenu
            }//.shangjia
          }
      }//.left-menu

      
      .right-menu{//右侧按钮
          float: right;
          li{
            float: left;
            font-family: "Microsoft YaHei";
            color: #666;
            width:81px;
            height:35px;
            line-height: 35px;
            text-align: center;
            &.login-reg:hover{//登录注册按钮
                background: #EEEEEE;
            }
            &.order{//我的订单
              .submenu{
                width:80px;
                height:125px;
                .content{
                  ul{
                    li{
                      width:78px;
                      height:20px;
                      margin-top: 8px;
                      padding: 0;
                      line-height: 20px;
                      text-align: left;
                      padding-left: 10px;
                      a:hover{
                        text-decoration: none;
                      }
                    }
                  }//ul
                }//.content
              }//.submenu
            }//li.order
            &.myegou{//我的易购
              .submenu{
                width:162px;
                height:161px;
                .touxiang-login{
                  width:145px;
                  height:60px;
                  //background: blue;
                  margin:5px auto 0px;
                  position: relative;
                  .ico-tx{//小头像
                    display: block;
                    width:55px;
                    height:55px;
                    border:1px solid #F7F7F7;
                    background: url(../images/ico-index-2.png) no-repeat -85px -269px;
                    position: absolute;
                    left:0;
                    top:0;
                  }
                  .plz-login{//请登录
                    position: absolute;
                    right:30px;
                    top:9px;
                    &:hover{
                      text-decoration: none;
                    }
                  }
                  .daka{//点击打卡
                    display: block;
                    width:64px;
                    height:22px;
                    background: #FF6600;
                    color: #fff;
                    text-align: center;
                    line-height: 22px;
                    border-radius: 4px;
                    position: absolute;
                    right:4px;
                    bottom:7px;
                    &:hover{
                      text-decoration: none;
                    }
                  }
                }//.touxiang-login
                .content{
                  ul{
                    li{
                      width:78px;
                      height:20px;
                      margin-top: 8px;
                      padding: 0;
                      line-height: 20px;
                      text-align: left;
                      text-indent: 1em;
                      a{
                        &:hover{
                          text-decoration: none;
                        }
                        .iconfont.vip{
                          font-size: 16px;
                          color:#ffd200;
                        }
                      }
                    }//li
                  }//ul
                }//.content
              }//.submenu
            }//.myegou
            &.yifubao{//易付宝
              width:50px;
            }
            &.mobileSN{//手机苏宁
              width:100px;
              em.iconfont{
                font-size:18px;
                color: #666;
                margin-right:5px;
                line-height: 30px;
              }
              .submenu{
                width:360px;
                height:220px;
                left:-51px;
                .left-box{
                  width:180px;
                  height:220px;
                  background: url(../images/header/ico-line-mibileSN.png) no-repeat right 43px;
                  float: left;
                  .pic-snApp{//手机客户端图片
                    display: block;
                    width: 145px;
                    height:145px;
                    margin:18px auto 0;
                  }
                  .tip{//提示
                    text-align: center;
                    color: #666;
                    margin-top: 9px;
                  }
                  .gift{//新人礼包
                    display: block;
                    width: 151px;
                    height:16px;
                    margin:3px auto 0;
                  }
                }//.left-box
                .right-box{
                  width:180px;
                  height:220px;
                  float: right;
                  .pic-yfbApp{//易付宝图片
                    display: block;
                    width:145px;
                    height:145px;
                    margin:18px auto 0;
                  }
                  .scan{//扫一扫
                    text-align: center;
                    color: #666;
                    margin-top: 9px;
                  }
                  .tip{//提示
                    text-align: center;
                    color: #666;
                  }
                }
              }//.submenu
              .down-title.cur{
                width:98px;
              }
            }//li.mobileSN
            &.cart{//购物车
              width:88px;
              em.iconfont{
                font-size:18px;
                color: #666;
                margin-right:5px;
                line-height: 30px;
              }
              span{
                display: inline-block;
                width:16px;
                height:16px;
                line-height: 16px;
                text-align: center;
                border-radius: 50%;
                background: #fa0;
                position: relative;
                bottom:8px;
                color: #fff;
                font-weight:bold;
              }
            }//.cart
            &.kefu{//客户服务
              .down-title{
                cursor: default;
              }
              .submenu{
                width:162px;
                height:94px;
                left: -82px;
                .content{
                  ul{
                    li{
                      width:78px;
                      height:20px;
                      margin-top: 8px;
                      padding: 0;
                      line-height: 20px;
                      text-align: left;
                      text-indent: 1em;
                      a{
                        &:hover{
                          text-decoration: none;
                        }
                        .iconfont.smile{
                          font-size: 16px;
                          color:#ffd200;
                        }
                      }
                    }//li
                  }//ul
                }//.content
              }//.submenu
            }//li.kefu
          }//li
      }//.right-menu
    }//.box
}//.header-loginBar
/***********顶部登录区结束*************/


/***********logo及搜索区结束*************/
.header-searchBar{
  width:100%;
  height:100px;
  background: #E80018;
  .box{
    width:1190px;
    height:100px;
    margin:0 auto;
    //background: pink;
    .logo-ad-box{
      width:360px;
      height:100px;
      float: left;
      .logo{
        width:190px;
        height:90px;
        float: left;
      }
      .logo-ad{
        width:160px;
        height:100px;
        float: left;
      }
    }//.logo-ad-box
    .search-hotwords-box{
      width:540px;
      height:100px;
      float: left;
      .search-box{//搜索框
        width:540px;
        height:40px;
        margin-top:30px;
        position: relative;
        .search-text{//搜索框>输入框
          width:418px;
          height:36px;
          border:2px solid #FFAA00;
          float: left;
          border-right: none;
          text-indent: 2em;
        }
        .ico-search{//搜索框>搜索小图标
          display: block;
          color: #ccc;
          font-size:14px;
          position: absolute;
          left:10px;
          top:9px;
        }
        .search-btn{//搜索框>搜索按钮
          width:120px;
          height:40px;
          background: #F90;
          color: #fff;
          font-weight:bold;
          font-family: "Microsoft YaHei";
          border:none;
          font-size:18px;
          line-height: 40px;
          float: left;
          &:hover{
            background: #f80;
          }
        }//.search-btn
        .search-down{//搜索框获得焦点的下拉菜单
          width:538px;
          height:269px;
          border:1px solid #E4E4E4;
          position: absolute;
          background: #fff;
          top:41px;
          left:0;
          display: none;
          z-index: 40;
          .ico-x{//关闭按钮
            position: absolute;
            right:4px;
            top:0;
            color: #999;
            font-size:16px;
            cursor: pointer;
            &:hover{
              color: #FF6617;
            }
          }
          .left-box{//左侧
            width:250px;
            height:269px;
            border-right:1px solid #EFEFEF;
            float: left;
            .recent-search{//最近搜索
              background: #eee;
              width:100%;
              height:29px;
              color: #999;
              line-height: 29px;
              font-family: "Microsoft YaHei";
              text-indent: 1em;
            }
            .search-none{//还未探索
              display: block;
              width:160px;
              height:136px;
              margin:40px auto 0;
            }
          }
          .right-box{//右侧
            width:287px;
            height:269px;
            float: left;
            .searching{//正在热搜中...
              height:29px;
              line-height: 29px;
              text-indent: 1em;
              font-family: "Microsoft YaHei";
              color: #999;
              overflow: hidden;
            }
            .hot-search{//热搜
              width: 269px;
              //height:220px;
              margin-left:12px;
              margin-top: -15px;
              //background: pink;
              a{
                display: inline-block;
                height:24px;
                line-height: 24px;
                color: #666;
                border:1px solid #e1e1e1;
                padding:0 5px;
                //margin-right:15px;
                margin-right:12px;
                margin-top:15px;
                font-family: "Microsoft YaHei";
                &.veryhot{
                  color: #F60;
                  border-color: #F60;
                }
                &:hover{
                  background: #F60;
                  color: #fff;
                }
              }
            }//.hot-search
          }//.right-box
        }//.search-down
      }//.search-box
      .hot-words{//热词搜索
        width:540px;
        height:30px;
        li{
          float: left;
          margin-right:10px;
          height:30px;
          line-height: 30px;
          a{
            color: #fff;
          }
        }
      }//.hot-words
    }//.search-hotwords-box
  }//.box
}//.header-searchBar
/***********logo及搜索区结束*************/

/***********中部百分百导航按钮*************/
.header-navBar{
  width:100%;
  height:38px;
  background: #A60024;
  .box{
    width:1190px;
    height:38px;
    margin:0 auto;
    .left-sort{//左侧商品分类
      width:190px;
      height:38px;
      float: left;
      position: relative;
      .sort-title{//标题
        display: block;
        width:100%;
        height:100%;
        background: #FF9900;
        line-height: 38px;
        //color: #FFF !important;
        color: #fff;
        font-size:13px;
        font-weight:700;
        font-family: "Microsoft Yahei",tahoma,arial,"Hiragino Sans GB";
        &:hover{
          background: #F80;
        }
        .ico-sort{
          display: inline-block;
          width:12px;
          height:10px;
          background: url(../images/ico-index.png) 0 0;
          margin-left:9px;
          margin-right:5px;
        }
      }//.sort-title
      .side-menu{//全部商品分类侧栏
        background: rgba(37,34,33,0.9);
        width:190px;
        height:440px;
        position: absolute;
        left:0;
        top:38px;
        z-index: 20;
        .side-menu-ul-box{
          .side-menu-li-items{//各组按钮
            width:191px;
            height:31px;
            line-height: 34px;
            &:hover{
              .submenu-box{
                display: block;
              }
            }
            .items-box{//标题框
              width:189px;
              position: relative;
              z-index: 20;
              &:hover{
                background: #fff;
                //background: pink;
                border-top:1px solid #382526;
                border-bottom:1px solid #382526;
                border-right: 1px solid white;
                a.items-link{
                  color: #333;
                }
              }//.items-box
              i.ico-menu-items{//小图标
                color: #fea900;
                font-family: Arial;
                font-size:12px;
                margin-left:8px;
              }
              a.items-link{//标题链接
                color: #fff;
                font-family: "Microsoft Yahei";
                margin-left:3px;
                &:hover{
                  color: #f60;
                }
              }//a.items-link
              span.ico-slash{//斜线
                color: #777;
                font-family: "Microsoft Yahei";
              }
            }//.items-box
            .submenu-box{//二级菜单
              width:998px;
              height:438px;
              border:1px solid #382526;
              border-left: 0;
              background: white;
              position: absolute;
              left:190px;
              top:0;
              //display: none;
              .left-box{//左半部分
                width:800px;
                height:100%;
                //background: pink;
                float: left;
                .hot-btn{//热门按钮
                  margin:10px 0 6px 33px;
                  width:765px;
                  height:24px;
                  li{
                    line-height: 24px;
                    float: left;
                    height:24px;
                    padding:0 10px;
                    margin-right:25px;
                    background: #f90;
                    &:last-child{
                      margin-right:0;
                    }
                    &:hover{
                      background: #f80;
                    }
                    a{
                      color: #fff;
                      font-family: "Microsoft Yahei";
                    }
                  }//li
                }//.hot-btn
                .menu-lists{//详细菜单
                  width:736px;
                  margin:0 auto;
                  position: relative;
                  overflow: hidden;
                  &:last-child{
                    .lists{
                      border-bottom: none;
                    }
                  }
                  .title{//标题
                    display: block;
                    float: left;
                    color: #333;
                    line-height: 42px;
                    font-weight: 700;
                    font-family: "Microsoft Yahei";
                    &:hover{
                      color: #f60;
                    }
                  }
                  .lists{//各小链接
                    width:650px;
                    float: right;
                    border-bottom:1px solid #eee;
                    padding-bottom: 8px;
                    padding-top: 10px;
                    li{
                      float: left;
                      line-height: 20px;
                      margin-right:15px;
                      &.hot{
                        a{
                          color: #f60;
                        }
                      }
                      a{
                        color: #666;
                        font-family: "Microsoft Yahei";
                        &:hover{
                          color: #f60;
                        }
                      }
                    }//li
                  }//.lists
                }//.menu-lists
              }//.left-box
              .right-box{//右半部分
                width:180px;
                height:100%;
                background: palegreen;
                float: right;
                margin-right:10px;
              }
            }//.submenu-box
          }//.side-menu-li-items
        }//.side-menu-ul-box
      }//.side-menu （要小心别写成了.//side-menu不然less会错不会自动生成css）
    }//.left-sort

    .center-nav{//中部导航按钮
      width:830px;
      height:38px;
      //background: greenyellow;
      float: left;
      .nav-box{
        margin-left: 23px;
        li{
          float: left;
          margin-right:21px;
          height: 38px;
          line-height: 38px;
          color: #fff;
          position: relative;
          overflow: hidden;
          a{
            color: #fff;
            font-size:15px;
            font-family:"Microsoft Yahei";
            font-weight:700;
          }
          .ico-nav-cur{//鼠标移入时的小图标
            display: block;
            width:25px;
            height:8px;
            background: url(../images/ico-index.png) -37px 0;
            position: absolute;
            bottom:-8px;
            left:50%;
            margin-left:-12px;
          }
        }//li
      }//.box
    }//.center-nav
    .right-survey{//右侧有奖调研
      width:170px;
      height:38px;
      float: right;
      a{
        display: block;
        width:100%;
        height:100%;
        text-align: center;
        line-height: 38px;
        .ico-info{
          display: inline-block;
          width:12px;
          height:13px;
          background: url(../images/ico-index.png) -186px -67px;
          margin-right:5px;
          position: relative;
          top:4px;
        }
        span{
          color: #fff;
          &:hover{
            color: #F60;
          }
        }
      }//a
    }//.right-survey
  }//.box
}//.header-navBar
/***********中部百分百导航按钮结束*************/

/***********轮播图及右侧相关快捷栏区*************/
.main-flash-shortcut{
  width:1190px;
  height:440px;
  background: pink;
  margin:0 auto;
  .center-flash{//中央轮播图区
    width:830px;
    height:440px;
    background: gold;
    float: left;
    margin-left:190px;
    position: relative;
    .f-box{//轮播块
      width:100%;
      height:100%;
      position: absolute;
      top:0;
      left:0;
      display: none;
      .big-flash{//大图
        display: block;
        width:830px;
        height:440px;
        img{
          width:830px;
          height:440px;
        }
      }//.big-flash
      .small-flash-box{//小图
        width:150px;
        //height:430px;
        height:435px;
        position: absolute;
        right:5px;
        top:5px;
        a{
          display: block;
          width:149px;
          height:212px;
          padding: 1px;
          background: rgba(255,255,255,0.7);
          margin-bottom: 4px;
          &:hover{
            background: rgba(255,255,255,0.9);
          }
          .img-title{//图片标题
            font:14px/22px "Microsoft Yahei",tahoma,arial,"Hiragino Sans GB";
            color: #333;
            width:115px;
            height:20px;
            overflow: hidden;
            margin-left: 20px;
            margin-top:16px;
          }
          .img-desc{//图片描述
            font:12px/18px "Microsoft Yahei",tahoma,arial,"Hiragino Sans GB";
            color: #666;
            width:115px;
            height:20px;
            overflow: hidden;
            margin-left: 20px;
          }
          .small-img{//图片
            display: block;
            margin:10px auto 0;
            width:140px;
            height:140px;
          }
        }//a
      }//.small-flash-box
    }//.f-box
    .f-btn{//小圆点按钮
      position: absolute;
      z-index: 10;
      left: 50%;
      bottom:20px;
      margin-left: -118px;
      li{
        float: left;
        width:16px;
        height:16px;
        border:2px solid rgba(219, 217, 212, 0.2);
        border-radius:50%;
        background: rgba(255,255,255,0.7);
        margin-right:8px;
        cursor: pointer;
      }
    }//.f-btn
      .arrow-btn{//前进后退箭头按钮
        width:30px;
        height:64px;
        background: url(../images/ico-index.png) -82px -145px;
        position: absolute;
        top:180px;
        z-index: 10;
        cursor: pointer;
        &.pre-btn{
          left:0;
          &:hover{
            background-position-x: -161px;
          }
        }//.pre-btn
        &.next-btn{
          right:0;
          background-position-x: -120px;
          &:hover{
            background-position-x: -198px;
          }
        }//.next-btn
      }//.arrow-btn
  }//.center-flash
  .right-shortcut{//右侧快捷服务区
    width:170px;
    height:440px;
    background: #fff;
    float: right;
    .top-box{//上部：登录部分
      width:170px;
      height:175px;
      border-bottom:1px solid #F2F2F2;
      .touxiang{//头像
        display: block;
        width:70px;
        height:70px;
        background: url(../images/ico-index.png) no-repeat -91px -20px;
        margin:0 auto;
        position: relative;
        top:6px;
      }
      .hi{//hi,你好
        color: #333;
        font:12px/24px "Microsoft Yahei",tahoma,arial,"Hiragino Sans GB";
        text-align: center;
        width:150px;
        height:20px;
        line-break: 20px;
        margin:6px auto 0;
      }
      .login-btn{//登录及新人有礼按钮
        width:150px;
        height:26px;
        margin:10px auto 0;
        .login{
          display: block;
          width:70px;
          height:26px;
          background: #f90;
          color: #fff;
          text-align: center;
          line-height:26px;
          float: left;
          font-family: "Microsoft Yahei";
          &:hover{
            background: #f80;
          }
        }//.login
        .reg{
          display: block;
          width:69px;
          height:24px;
          color: #f90;
          border:1px solid #f90;
          line-height:24px;
          text-align: center;
          float: right;
          font-family: "Microsoft Yahei";
          &:hover{
            color: #fff;
            background: #f80;
          }
        }//.reg
      }//.login-btn
      .get-benefits{//领云钻及领券
        margin: 10px auto 0;
        width:150px;
        height:20px;
        a{
          display: block;
          font-family: "Microsoft Yahei";
          color: #333;
          &:hover {
            color: #f60;
            span {
              color: #f60;
            }
          }
          i{//小图标
            display: inline-block;
            width:16px;
            height:14px;
            background: url(../images/ico-index.png) no-repeat -110px 2px;
            margin-right: 5px;
          }
          span{//小箭头
            color: #333;
            font-family: "Simsun";
            margin-left: 5px;
          }
          &.zuan{
            float: left;
            .ico-zuan{background-position-x: -110px}
          }
          &.quan{
            float: right;padding-right: 11px;
            .ico-quan{background-position-x: -88px}
          }
        }//a
      }//.get-benefits
    }//.top-box
    .middle-box{//中部：信息滚动部分
      width:170px;
      height:118px;
      border-bottom:1px solid #F2F2F2;
      position: relative;
      .dis-box{//显示窗
        width:170px;
        height:98px;
        position: relative;
        top:10px;
        overflow: hidden;
        .scroll-box{//大滚动箱
          width:170px;
          height:294px;
          position: absolute;
          top:0;
          left:0;
          z-index: 15;
          .box{//要滚动的一块
            width:170px;
            height:98px;
            a{//文字链接
              display: block;
              width:150px;
              margin: 0 auto 8px;
              position: relative;
              top:8px;
              color: #333;
              font-family: "Microsoft YaHei";
              &:hover{
                color: #f60;
              }
              span{//分类
                color: #f60;
                margin-right: 5px;
              }
            }//a
          }//.box
        }//.scroll-box
      }//.dis-box
    }//.middle-box
    .bottom-box{//下部：快捷按钮
      width:170px;
      height:145px;
      .shortcuts{
        width:100%;
        height:100%;
        border-collapse: collapse;
        tr{
          td{
            width:56px;
            height:72px;
            border-right:1px solid #F2F2F2;
            border-bottom:1px solid #F2F2F2;
            text-align: center;
            //cursor: pointer;
            i{//小图标
              display: block;
              color: #f90;
              font-size:24px;
            }
            span{//标题
              color: #333;
              font-family: "Microsoft YaHei";
              position: relative;
              top:2px;
              &:hover{
                color: #f60;
              }
            }
            &.nbr{
              border-right:none;
            }
          }//td
          &.nbb{
            td{
              border-bottom:none;
            }
          }
        }//tr
      }//table.shortcuts
    }//.bottom-box
  }//.right-shortcut
}//.main-flash-shortcut
/***********轮播图及右侧相关快捷栏区结束*************/